<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>首页</title>
    <link rel="stylesheet" href="./utils/bootstrap.min.css" />
    <link rel="stylesheet" href="./css/home.min.css" />
    <script src="./utils/jquery-3.5.1.min.js"></script>
    <script src="./utils/bootstrap-4.6.0-dist/js/bootstrap.bundle.min.js"></script>
  </head>
  <body>
    <div>
      <div class="header">
        <img src="./img/home/logo.png" alt="" />
        <div class="userInfo">
          <img class="img" id="top-img" src="" />
          <!-- <img src="" alt="" /> -->

          <a href="#" id="top-username"></a>
          <a href="#" data-toggle="modal" data-target="#settingModel">
            <img src="./img/home/setting.png" alt="" />
          </a>
        </div>
      </div>
      <div class="main">
        <div class="nav">
          <a class="nav-item" href="./start-test.html" id="test-type1">
            <img src="./img/home/home-nav (1).jpg" alt="" />
          </a>
          <a class="nav-item" href="#">
            <img src="./img/home/home-nav (2).jpg" alt="" />
          </a>
          <a class="nav-item" href="#">
            <img src="./img/home/home-nav (3).jpg" alt="" />
          </a>
          <a class="nav-item" href="#">
            <img src="./img/home/home-nav (4).jpg" alt="" />
          </a>
          <a class="nav-item" href="./classify-1.html" id="test-type2">
            <img src="./img/home/home-nav (5).jpg" alt="" />
          </a>
        </div>
        <div class="content">
          <a
            class="topList"
            href="#"
            data-toggle="modal"
            data-target="#exampleModal"
          >
            <img src="./img/home/toplist.png" alt="" />
            排行榜
          </a>
          <div class="tab">
            <div class="active">首页</div>
            <div class="">我的收藏（共<span id="colNum"></span>）</div>
            <div class="">错题库（共<span id="errNum"></span>  ）</div>
          </div>
          <div class="tab-content">
            <!-- 内容1 -->
            <div class="content1">
              <div class="data-list">
                <div>
                  <span>数据看板</span>
                  <div class="study-state">
                    今日未学习
                    <img src="./img/home/study-state.png" alt="" />
                  </div>
                </div>
                <div>
                  <div class="study-num">
                    <div>
                      <span>138</span>
                      <p>练习题数</p>
                    </div>
                    <div>
                      <span>138</span>
                      <p>练习题数</p>
                    </div>
                    <div>
                      <span>138</span>
                      <p>练习题数</p>
                    </div>
                  </div>
                  <div class="study-day">
                    <div class="day-item"></div>
                    <div class="day-item"></div>
                    <div class="day-item"></div>
                    <div class="day-item"></div>
                    <div class="day-item"></div>
                    <div class="day-item"></div>
                    <div class="day-item"></div>
                  </div>
                </div>
              </div>
              <div class="infor-list">
                <div class="head">
                  <span>通知公告</span>

                  <div class="dropdown">
                    <button
                      class="btn btn-secondary dropdown-toggle"
                      type="button"
                      id="dropdownMenuButton"
                      data-toggle="dropdown"
                      aria-expanded="false"
                    >
                      全部
                    </button>
                    <div
                      style="width: 76px"
                      class="dropdown-menu"
                      aria-labelledby="dropdownMenuButton"
                    >
                      <a class="dropdown-item" href="#">全部</a>
                      <a class="dropdown-item" href="#">已读</a>
                      <a class="dropdown-item" href="#">未读</a>
                    </div>
                  </div>
                </div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
              </div>
            </div>
            <!-- 内容2 -->
            <div style="display: none">
              <div class="content2">
                <div class="left" id="collectContent">
                  <!-- <div class="" style="display: none;">
                    <h4>题目题目题目题目题目题目题目题目题目题目题目题目</h4>
                    <ul class="main2">
                      <li>
                        <button class="btn btn-light">A</button>
                        <span>111111</span>
                      </li>
                      <li>
                        <button class="btn btn-light">B</button>
                        <span>111111</span>
                      </li>
                      <li>
                        <button class="btn btn-light">C</button>
                        <span>111111</span>
                      </li>
                      <li>
                        <button class="btn btn-light">D</button>
                        <span>111111</span>
                      </li>
                    </ul>
                    <div class="button-box">
                      <button class="btn btn btn-primary">取消收藏</button>
                      <div>
                        <button class="btn btn btn-primary">上一题</button>
                        <button class="btn btn btn-primary">下一题</button>
                      </div>
                    </div>
                    <div class="footer">
                      <h6>11111</h6>
                      <p>解析</p>
                    </div>
                  </div> -->
                </div>
                <div class="right">
                  <p>
                    <span>题卡</span>
                    <span>共12题</span>
                  </p>
                  <div class="button-box">
                    <button type="button" class="btn btn-light">1</button>
                    <button type="button" class="btn btn-light">1</button>
                    <button type="button" class="btn btn-light">1</button>
                    <button type="button" class="btn btn-light">1</button>
                    
                  </div>
                  <div class="check">
                    默认显示注释
                    <div class="custom-control custom-switch">
                      <input
                        type="checkbox"
                        class="custom-control-input"
                        id="customSwitch1"
                      />
                      <label
                        class="custom-control-label"
                        for="customSwitch1"
                      ></label>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!-- 内容3 -->
            <div style="display: none">
              <div class="content2">
                <div class="left" id="exe"> 
                  
                  
                </div>
                <div class="right">
                  <p>
                    <span>题卡</span>
                    <span>共12题</span>
                  </p>
                  <div class="button-box">
                    <button type="button" class="btn btn-light">1</button>
                    <button type="button" class="btn btn-light">1</button>
                    <button type="button" class="btn btn-light">1</button>
                    <button type="button" class="btn btn-light">1</button>
                    
                  </div>
                  <div class="check">
                    默认显示注释
                    <div class="custom-control custom-switch">
                      <input
                        type="checkbox"
                        class="custom-control-input"
                        id="customSwitch1"
                      />
                      <label
                        class="custom-control-label"
                        for="customSwitch1"
                      ></label>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Modal setting-->
      <div
        class="modal fade"
        id="settingModel"
        tabindex="-1"
        aria-labelledby="exampleModalLabel"
        aria-hidden="true"
      >
        <div
          class="
            modal-dialog modal-dialog-centered modal-dialog-scrollable modal-lg
          "
        >
          <div class="modal-content">
            <!-- 头 -->
            <div class="modal-header">
              <h5 class="modal-title" id="exampleModalLabel">修改资料</h5>
              <button
                type="button"
                class="close"
                data-dismiss="modal"
                aria-label="Close"
              >
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <!-- 身体 -->
            <div class="modal-body">
              <div class="alert alert-primary" role="alert">
                ！ 你可以在这里对个人资料进行完善
              </div>
              <table class="table table-borderless">
                <tbody>
                  <tr>
                    <td>手机号码：</td>
                    <td>
                      <span id="setting-phone"></span
                      ><i
                        >&nbsp;&nbsp;&nbsp;&nbsp;手机号暂时不允许进行修改，如需修改，请联系我们</i
                      >
                    </td>
                  </tr>
                  <tr>
                    <td>设置头像</td>
                    <td class="td">
                      <div class="setting-imgbox">
                        <img
                          src="./img/home/userimg.ico"
                          class="img-user-setting"
                        />
                        <input type="file" id="upImg" ></input>
                      </div>
                    </td>
                  </tr>
                  <tr>
                    <td>姓名</td>
                    <td><input type="text"  id="setting-name"/></td>
                  </tr>
                  <tr>
                    <td>性别</td>
                    <td class="setting-sex">
                      男：<input type="radio" name="sex"  value="男" checked/> 女：<input
                        type="radio"
                        name="sex"
                        value="女"
                      />
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
            <div class="modal-footer">
              <button
                type="button"
                class="btn btn-secondary"
                data-dismiss="modal"
              >
                关闭
              </button>
              <button type="button" class="btn btn-primary" id="settingBtn" data-dismiss="modal">提交保存</button>
            </div>
          </div>
        </div>
      </div>
      <!-- Modal toplist-->
      <div
        class="modal fade"
        id="exampleModal"
        tabindex="-1"
        aria-labelledby="exampleModalLabel"
        aria-hidden="true"
      >
        <div class="modal-dialog">
          <div class="modal-content">
            <!-- 头 -->
            <div class="modal-header">
              <h5 class="modal-title" id="exampleModalLabel">
                正式考试排行top10
              </h5>
              <button
                type="button"
                class="close"
                data-dismiss="modal"
                aria-label="Close"
              >
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <!-- 身体 -->
            <div class="modal-body">
              <div class="row topList-model">
                <div class="col-3">名次</div>
                <div class="col-6">姓名</div>
                <div class="col-3">分数</div>
              </div>
              <div class="row topList-model list-model">
                <!-- <div class="col-3">
                  1
                  <img src="" alt="" />
                </div>
                <div class="col-6">我自己</div>
                <div class="col-3">99</div> -->
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script src="./js/tab.js"></script>

    <script src="./js/auth.js"></script>
    <script src="./js/home.js"></script>
    <script src="./js/honeError.js"></script>
    <script src="./js/homeCollect.js"></script>
    <script src="./js/homeToplist.js"></script>
  </body>
</html>
